<template>
	<view @click="goIndexInfo" class="card bg-white u-m-t-20">
		<view class="u-flex u-p-28">
			<view>
				<u-image border-radius="14px" width="115px" height="115px" :src="item.adopt.cover">
				</u-image>
			</view>
			<view class="right u-m-l-28">
				<view class="title u-line-1 u-font-32">
					{{item.adopt.title}}
				</view>
				<view class="info u-m-t-8">
					<u-tag class="u-m-r-8" color="#808080" :text="item.adopt.age" size="mini" bg-color="#F6F7FB"
						mode="dark" />
					<u-tag class="u-m-r-8" color="#808080" :text="item.adopt.sex" size="mini" bg-color="#F6F7FB"
						mode="dark" />
					<u-tag class="u-m-r-8" color="#808080" :text="item.adopt.district" size="mini" bg-color="#F6F7FB"
						mode="dark" />
				</view>

				<view class="u-line-2 color-80 u-font-12 u-m-t-8">{{item.adopt.story}}</view>

				<view class="info u-m-t-8">
					<u-tag class="u-m-r-8" color="#333" :text="item.adopt.vaccine" size="mini" bg-color="#FEF2BF"
						mode="dark" />
					<u-tag class="u-m-r-8" color="#333" :text="item.adopt.expelling_parasite" size="mini"
						bg-color="#FEF2BF" mode="dark" />
					<u-tag class="u-m-r-8" color="#333" :text="item.adopt.sterilize" size="mini" bg-color="#FEF2BF"
						mode="dark" />
				</view>
			</view>
		</view>
		<view class="u-font-10 color-80 u-p-l-28 u-p-r-28 u-p-b-16 u-flex u-row-between">
			<text>{{item.create_time}}</text>
		</view>
	</view>
</template>

<script>
	export default {
		props: ['item'],
		name: "getCard",
		data() {
			return {

			};
		},
		methods: {
			goIndexInfo() {
				uni.navigateTo({
					url: '/pagesIndex/indexInfo/indexInfo?id=' + this.item.id
				})
			}
		}
	}
</script>

<style lang="scss">
	.right {
		width: 61%;
		height: 115px;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	.card {
		border-radius: 6px;

		.money {
			color: #F34184;
		}
	}
</style>
